<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ include file="/WEB-INF/common/taglibs.jsp" %>
<div class="main-content">
    <div class="breadcrumbs" id="breadcrumbs">
        <div class="col-md-8 col-xs-12">
            <%@include file="/WEB-INF/common/back/breadcrumb.jsp" %>
        </div>
        <div class="col-md-4 text-right">
            <a class="btn btn-primary btn-sm no-border" href="${contextPath}/back/article/add">
                <i class="ace-icon fa fa-plus"></i>添加
            </a>
            <a class="btn btn-primary btn-sm no-border" onclick="exportExcel();" href="javascript:void(0);">
                <i class="ace-icon fa fa-download"></i>导出
            </a>
            <form id="hiddenForm" method="post">
                <input type="hidden" id="params" name="params">
                <input type="hidden" name="o" value="Article">
            </form>
        </div>
    </div>

    <div class="page-content">
        <div class="row">
            <div class="col-md-12">
                <form class="form-inline" id="searchForm" method="post">
                    <input name="pageIndex" type="hidden">
                    <input name="ifDel" type="hidden" value="0">
                    <%@include file="/WEB-INF/common/back/fragment/query-fragement.jsp" %>
                    <div class="space-4"></div>
                    <div class="row center">
                        <button type="button" id="queryBtn" class="btn btn-purple btn-sm no-border">
                            <i class="ace-icon fa fa-search fa-on-right"></i>查询
                        </button>
                        <button type="reset" class="btn btn-info btn-sm no-border">
                            <i class="ace-icon fa fa-undo fa-on-right"></i>清空
                        </button>
                    </div>
                    <div class="space-4"></div>
                </form>
            </div>
            <div class="col-xs-12">
                <table id="example" class="table table-striped table-bordered table-hover dataTable no-footer" cellspacing="0" width="100%">
                    <thead>
                    <tr>
                        <th>标题</th>
                        <th>分类</th>
                        <th>创建人</th>
                    </tr>
                    </thead>
                </table>
            </div>
        </div>
    </div>
</div>

<script src="${contextPath}/static/ace/assets/js/jquery.dataTables.min.js"></script>
<script src="${contextPath}/static/ace/assets/js/jquery.dataTables.bootstrap.min.js"></script>
<script src="${contextPath}/static/ace/assets/js/dataTables.tableTools.min.js"></script>
<script src="${contextPath}/static/ace/assets/js/dataTables.colVis.min.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $('#example').on('processing.dt', function (e, settings, processing) {
            $('#example_processing').css('border', 'none');
            $('#example_processing').css('background-color', 'transparent');

        }).DataTable({
            "sPaginationType": "full_numbers",
            "language": {
                "sProcessing": "<img src='${contextPath}/static/layer-v3.0.2/layer/skin/default/loading-2.gif'>",//这里很重要，如果你的加载中是文
                "lengthMenu": "显示 _MENU_",
                "zeroRecords": "抱歉，没有数据记录 ",
                "info": "第_PAGE_页 总_PAGES_页 共_TOTAL_项",
                "infoEmpty": "暂无数据",
                "infoFiltered": "(总计从_MAX_条记录查询)",
                "search": "查询内容:",
                select: {
                    rows: ""
                },
                "paginate": {
                    "first": "首页",
                    "last": "尾页",
                    "next": "下一页",
                    "previous": "上一页"
                }
            },
//            bLengthChange: false,//去掉每页多少条框体
            "searching": false,//去掉搜索框
            "processing": true,
            "serverSide": true,
            "ajax": "${contextPath}/back/article/listDataTable",
            "columns": [
                {"data": "title"},
                {"data": "category"},
                {"data": "creator"},
            ]
        });
    });

    function del(id) {
        layer.confirm('确定删除？', {
            btn: ['确定', '取消'] //按钮
        }, function () {
            $.ajax({
                type: "POST",
                url: "${contextPath}/back/article/delSoft",
                dataType: "json",
                data: {
                    ids: id
                },
                success: function (json) {
                    if (json.success) {
                        $('#jqxgrid').jqxGrid('updatebounddata');
                        layer.closeAll('dialog');
                    } else {
                        layer.msg(json.msg);
                    }
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    layer.msg("对不起，系统异常！");
                }
            });
        }, function () {

        });
    }

    function exportExcel() {
        var form = $("#hiddenForm");
        form.attr("action", "/auto/export?fileName=导出结果");
        $("#params").val(JSON.stringify($("#searchForm").serializeObject()));
        form.submit();
    }

    var handleRender = function (row, column, value) {
        var data = $("#jqxgrid").jqxGrid('getrowdata', row);
        if (data == undefined) {
            return "";
        }
        var btn = "&nbsp";
        <world:hasPermission permissions="/back/article/view">
        btn += "<a class='btn btn-xs btn-success' href='${contextPath}/back/article/view?id=" + data.id + "'>预览</a> ";
        </world:hasPermission>
        <world:hasPermission permissions="/back/article/edit">
        btn += "<a class='btn btn-xs btn-info' href='${contextPath}/back/article/edit?id=" + data.id + "'>编辑</a> ";
        </world:hasPermission>
        <world:hasPermission permissions="/back/article/delSoft">
        btn += '<button class="btn btn-xs btn-danger" onclick="del(\'' + data.id + '\')">删除</button> ';
        </world:hasPermission>
        return btn;
    };
</script>